<template>
  <div class='table-page-search-wrapper'>
    <a-form layout='inline' :form='form'>
      <a-row :gutter='24'>
        <slot v-bind="$attrs"></slot>
        <template v-if='advanced'>
          <slot name='advanced'></slot>
        </template>
        <a-col :md='!advanced && 6 || 3' :sm='24' v-if='showSearchBtn'>
          <span class='table-page-search-submitButtons' :style="advanced && { float: 'left', overflow: 'hidden' } || {} ">
            <a-button type='primary' @click='searchHandler'>查询</a-button>
            <a-button  style='margin-left: 3px' @click='exportHandler' v-if='showExportBtn'>导出</a-button>
             <slot name='btn'></slot>
            <a-button style='margin-left: 3px' @click='resetForm'>重置</a-button>
            <a @click='toggleAdvanced' style='margin-left: 3px' v-if='more&&showMore'>
              {{ advanced ? '收起' : '更多' }}
              <a-icon :type="advanced ? 'up' : 'down'" />
            </a>
          </span>
        </a-col>
      </a-row>
    </a-form>
  </div>
</template>
<script>

export default {
  name: 'fSearchForm',
  provide() {
    return {
      queryParam: this.queryParam
    }
  },
  props: {
    formKey: {
      type: String,
      default: ''
    },
    globalParams: {
      type: Object,
      default: () => {
      }
    },
    tableId: {
      type: String,
      default: null
    },
    showSearchBtn: {
      type: Boolean,
      default: true
    },
    showExportBtn: {
      type: Boolean,
      default: false
    },
    exportUrl:{
      type: String,
      default: null
    },
    tableObj: {
      type: Object,
      default: null
    },
    more: {
      type: Boolean,
      default: true
    }
  },
  data() {
    return {
      form: this.$form.createForm(this),
      // 高级搜索 展开/关闭
      advanced: false,
      showMore: true,
      queryParam: {},
      searchParams: {}
    }
  },
  methods: {
    searchHandler() {
      let searchParams = Object.assign({}, this.form.getFieldsValue(), this.queryParam)
      this.searchParams=searchParams;
      if (this.tableObj) {
        this.tableObj.refresh(true, searchParams)
      } else {
        this.$emit('searchHandler', searchParams)
      }
      //this.$bus.emit('reloadTable', this.form.getFieldsValue(), this.tableId)
    },
    resetForm() {
      this.form.resetFields()
      if (this.tableObj) {
        this.tableObj.reset(this.globalParams)
      } else {
        this.$bus.emit('resetSearchParams', {})
      }
    },
    exportHandler(){
      this.tableObj.tableExport(this.exportUrl);
    },
    toggleAdvanced() {
      this.advanced = !this.advanced
    }
  },
  computed: {},
  created() {
    if (!this.$slots['advanced']) {
      this.showMore = false
    }
    console.log('########', this.$slots['advanced'])
  }
}
</script>
